<template>
  <div id="about">
    <el-card>
      <el-table :data="tableData">
        <el-table-column prop="date" align="center" label="日期" width="180">
        </el-table-column>
        <el-table-column prop="name" align="center" label="姓名" width="180">
        </el-table-column>
        <el-table-column prop="address" align="center" label="地址">
        </el-table-column>
        <el-table-column fixed="right" align="center" label="操作" width="200">
          <template>
            <el-button type="text" size="small" v-permission="{ action: 'add' }"
              >添加</el-button
            >
            <el-button type="text" size="small" v-permission="{ action: 'del' }"
              >删除</el-button
            >
            <el-button
              type="text"
              size="small"
              v-permission="{ action: 'updata', effect: 'disabled' }"
              >编辑</el-button
            >
            <el-button
              type="text"
              size="small"
              v-permission="{ action: 'view' }"
              >查看</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
export default {
  name: "",
  data() {
    return {
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        // {
        //   date: "2016-05-04",
        //   name: "王小虎",
        //   address: "上海市普陀区金沙江路 1517 弄",
        // },
        // {
        //   date: "2016-05-01",
        //   name: "王小虎",
        //   address: "上海市普陀区金沙江路 1519 弄",
        // },
        // {
        //   date: "2016-05-03",
        //   name: "王小虎",
        //   address: "上海市普陀区金沙江路 1516 弄",
        // },
      ],
    };
  },

  components: {},

  methods: {},
};
</script>

<style lang="scss" scoped>
#about {
  .el-card {
    margin: 50px auto;
    width: 1000px;
    .el-table {
      width: 100%;
    }
  }
}
</style>